<template>
<el-col :span="24" style="position:relative;box-shadow:0 5px 10px #ddd;padding:5px;background:#fff;border: 1px solid #f0f0f0;" v-if="buttonList.Id!=''?true:false">
    <el-row :span="24">
        <template>
            <el-button plain v-for="(item,index)  in buttonList" :key="index" type="primary" @click="callFn(item.Action)" size="small" round><i :class="item.Icon"></i>{{item.Name}}</el-button>

        </template>

    </el-row>
</el-col>
</template>

<script>
import {
    getPermissionButton,
    deleteUser
} from '../../api/api';
export default {
    name: 'ButtonBar',
    data() {
        return {
            buttonList: {
                Id: '',
                Name: '',
                Action: '',
                Icon: ''

            },

        }
    },
    props: {
        keyName: {
            type: String,
            default: ''
        }
    },
    methods: {
        callFn: function (params) {
            this.$emit("callAction", params);
        },
        getPermissionButtonList: function () {
            let _this = this;
            if (_this.keyName != undefined && _this.keyName != null && _this.keyName != "" && _this.keyName != '') {

                let para = {
                    name: _this.keyName
                };

                getPermissionButton(para).then(res => {
                    if (res.data && res.data.length > 0) {
                        _this.buttonList = res.data;
                    }

                });
            }

        }
    },
    mounted() {
        this.getPermissionButtonList();
        // this.list.map(item => {
        //     const reg1 = /^\w+/g;
        //     const reg2 = /\(([^)]+)\)/
        //     item.fn = item.method.match(reg1)[0]
        //     item.args = item.method.match(reg2)[1]
        // });
    }
}
</script>
